//重构需求 5243 取消分配
import {messages} from "share/common";
import React from 'react';
import menuRoute from 'routes/menuRoute';
import {connect} from 'react-redux';
import {Button, Table, Badge, Popconfirm} from 'antd';
import moment from 'moment';
import announcementService from 'containers/setting/announcement-information/announcement-information.service';
import 'styles/setting/announcement-information/announcement-information.scss';
import ResizeTable from "components/resize-table";

class AnnouncementInformation extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      loading: true,
      columnsCompany: [
        {
          title: messages("common.sequence"/*序号*/),
          dataIndex: 'index',
          width: 48,
          render: (value, record, index) =>
            this.state.pageSize * this.state.page + index + 1
        },
        {
          title: messages('setting.key64'/*新建日期*/),
          dataIndex: 'preferredDate', width: 120,
          render: value => moment(value).format('YYYY-MM-DD')
        },
        {
          title: messages('setting.key54'/*标题*/),
          dataIndex: 'title'
        },
        {
          title: messages("common.column.status"/*状态*/),
          dataIndex: 'enable', width: '10%', render: enable =>
          <Badge status={enable ? 'success' : 'error'}
                 text={enable ? messages("common.status.enable") : messages("common.status.disable")}/>
        },
      ],
      columns: [
        {
          title: messages("common.operation"/*操作*/),
          dataIndex: 'operation', width: '10%', render: (text, record) => (
          <span>
            <Popconfirm onConfirm={e => this.deleteItem(e, record)}
                        title={messages("common.confirm.delete")/*确定要删除吗？*/}>
              <a onClick={e => {
                e.stopPropagation()
              }}>{messages("common.delete"/*删除*/)}</a>
            </Popconfirm>
          </span>
        )
        },
      ],
      data: [],
      pagination: {
        total: 0
      },
      page: 0,
      pageSize: 10,
      newAnnouncement: menuRoute.getRouteItem('new-announcement-information', 'key'), //新建公告信息
      announcementDetail: menuRoute.getRouteItem('announcement-information-detail', 'key'), //公告信息详情
    }
  }

  componentDidMount() {
    this.getList()
  }

  getList = () => {
    this.setState({loading: true});
    announcementService.getAnnouncementList()
      .then(res => {
        this.setState({
          loading: false,
          data: res.data,
          pagination: {
            total: Number(res.headers['x-total-count']) || 0,
            current: this.state.page + 1,
            onChange: this.onChangePaper
          }
        })
      })
  };

  onChangePaper = (page) => {
    if (page - 1 !== this.state.page) {
      this.setState({page: page - 1}, () => {
        this.getList()
      })
    }
  };

  //删除公告信息
  deleteItem = (e, record) => {
    announcementService.deleteAnnouncement(record.carouselOID)
      .then(res => {
        this.getList()
      })
  };

  //新建公告信息页面
  handleNewAnnouncement = () => {
    this.context.router.push(this.state.newAnnouncement.url)
  };

  //公告信息详情页面
  handleRowClick = (record) => {
    let url = this.state.announcementDetail.url.replace(':OID', record.carouselOID).replace(':id', record.id);
    this.context.router.push(url)
  };

  render() {
    const {loading, data, columns, columnsCompany, pagination} = this.state;
    return (
      <div className="announcement-information">
        <div className="table-header">
          <div className="table-header-buttons">
            <Button type="primary"
                    disabled={!this.props.tenantMode}
                    onClick={this.handleNewAnnouncement}>{messages('common.create')/*新建*/}</Button>
          </div>
        </div>
        <ResizeTable
          rowKey="id"
          loading={loading}
          columns={this.props.tenantMode ? [...columnsCompany,...columns] : columnsCompany}
          dataSource={data}
          pagination={pagination}
          onRow={record => ({onClick: () => this.handleRowClick(record)})}
          bordered
          size="middle"/>
      </div>
    )
  }
}

AnnouncementInformation.contextTypes = {
  router: React.PropTypes.object
};

function mapStateToProps(state) {
  return {
    company: state.login.company,
    tenantMode: state.main.tenantMode
  }
}

export default connect(mapStateToProps)(AnnouncementInformation);
